<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" pageEncoding="UTF-8" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>宠物查询页面</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="${pageContext.request.contextPath}/static/css/css.css" rel="stylesheet" type="text/css">
<%--    <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" />--%>
    <style type="text/css">
        a{
            text-decoration: none;
            color: black;
            font-weight: bold;
        }
        #content {
            position: relative;
            top: 3px;
            width: 80%;
            height: 380px;
            margin: auto;
            overflow: hidden;
            z-index: 2;
        }

        .tab1 {
            position: relative;
            top: 100px;
            font-size: 24px;
        }

        #in1 {
            width: 250px;
            height: 30px;
            font-size: 24px;
        }

        #in3 {
            width: 250px;
            height: 30px;
            font-size: 24px;
        }

        #in2 {
            width: 80px;
            height: 28px;
        }
        .topc{
            float: left;
            border: 1px solid red;
            margin-left: 400px;
        }
        #a{
            margin-top: 130px;
        }
        .b{
            width: 500px;
            border-radius: 5px;
            font-weight: bold;
        }

        .a{
            float: left;
            margin-left: 20px;
            border-radius: 5px;
            font-weight: bold;
        }
        .c{
            float: left;
            margin-left: 80px;
            border-radius: 5px;
            font-weight: bold;
        }
    </style>
    <script type="text/javascript">
        function checkId() {
            if (document.getElementById("in1").value == ""
                && document.getElementById("in3").value == "") {
                alert("请输入宠物名称或主人名称！");
                return false;
            } else if (document.getElementById("in1").value != ""
                && document.getElementById("in3").value != "") {
                alert("仅支持单信息查询，双信息查询正在开发中...");
                return false;
            } else {
                return true;
            }
        }
    </script>
</head>
<body>
<!-- include top -->
<jsp:include page="${pageContext.request.contextPath}/top.jsp" flush="true"/>
<center>
    <div id="content">
        <c:if test="${msg!=null}">
            <span style="color: red">${msg}</span>
        </c:if>
        <form action="${pageContext.request.contextPath}/pet/queryPet" method="post" onsubmit="return checkId()">
            <table border="0" cellpadding="0" cellspacing="2" class="tab1">
                <tr align="center">
                    <td>宠物名称 </td>
                    <td>&nbsp;<input type="text" name="petName" id="in1"/></td>
                </tr>
                <tr align="center">
                    <td>主人名称 </td>
                    <td>&nbsp;<input type="text" name="ownName" id="in3"/></td>
                </tr>
                <tr>
                    <td ></td>
                    <td rowspan="2">
                        <div class="a" style="text-align: center">
                            <input class="btn btn-default" type="submit" value="查询">
                        </div>
                    </td>
                </tr>

            </table>
        </form>

       <div id="a">
            <div class="b">
                <div class="c">
                    <a class="btn btn-default"
                       href="${pageContext.request.contextPath}/pet/toPetAdd"
                       role="button">添加新宠物</a>
                </div>
                <div class="c">
                    <a class="btn btn-default"
                       href="${pageContext.request.contextPath}/pet/toOwnersAdd"
                       role="button">添加新主人</a>
                </div>
            </div>
        </div>
    </div>
</center>
<!-- include footer -->
<jsp:include page="${pageContext.request.contextPath}/footer.jsp" flush="true"/>
</body>
</html>

